import React, { Component } from 'react'
import { getMsg } from '../../redux/actionCreator';
import Mytab from '../root/Mytab';
import { withRouter } from "react-router-dom"
import { connect } from 'react-redux'

import pxPage from '../../root/pxPage'
import Avatar from '../../users/Me/Avatar';
const busmeme = {
    paddingTop: '50px',
    paddingBottom: '50px',
    paddingLeft: pxPage(24),
    paddingRight: pxPage(24),
}
const busmem = {
    paddingTop: pxPage(10),
    fontSize: pxPage(14)
}
const busbtn = {
    width: pxPage(64),
    height: pxPage(35),
    lineHeight: pxPage(35),
    position: 'absolute',
    top: pxPage(180),
    right: pxPage(20),
    fontSize: pxPage(20),
    lineHeight: pxPage(2.5),
}
const busbtn2 = {
    width: pxPage(64),
    height: pxPage(35),
    lineHeight: pxPage(35),
    position: 'absolute',
    top: pxPage(180),
    right: pxPage(60),
    fontSize: pxPage(20),
    lineHeight: pxPage(2.5),

}
class Busme extends Component {
    render() {
        return (
            <div style={{ minHeight: '100vh', display: 'flex', width: '100%' }}>

                <div style={{ backgroundColor: "#080904", minHeight: '100vh', display: 'flex', width: '100%' }}>

                    <div style={{ width: '100%', margin: '0 auto' }}>
                        {/* 头像 */}
                        <Avatar pic={`http://www.h5weixin.club:1025/api/image/${getMsg(this.props).business_pic}`} name={getMsg(this.props).business_name} />

                        <div className='busme-but' style={busbtn}
                            onClick={() => {
                                this.props.history.push('/setupbus')
                            }}
                        ><i className="iconfont icon-shezhi1" style={{ fontSize: '1.3em' }}></i></div>

                        <div className='busme-but' style={busbtn2}
                            onClick={() => {
                                this.props.history.push('/modify_business')
                            }}
                        ><i className="iconfont icon-15" style={{ fontSize: '1.3em' }}></i></div>

                        <div className='busme-me' style={busmeme}>
                            <div className='busme-score' style={busmem}>平均评分：{getMsg(this.props).business_score}星</div>
                            <div className='busme-time' style={busmem}>营业时间：{getMsg(this.props).business_time}</div>
                            <div className='busme-phone' style={busmem}>联系电话：{getMsg(this.props).business_phone}</div>
                            <div className='busme-describe' style={busmem}>关于采摘园：<br />
                                <div style={{ textIndent: '2em', paddingTop: '10px', lineHeight: '1.4em', fontSize: '1.1em' }}>{getMsg(this.props).business_describe}</div>
                            </div>
                            <div style={{ height: '30px' }}></div>
                        </div>
                    </div>
                    <Mytab />
                </div>
                <div style={{ flex: '1' }}></div>
            </div>
        )
    }
}

const mapStateToProps = (state) => ({
    login: state.login,
    // shop: state.shop,
    business: state.business,
    // shop_temp: state.shop_temp,
})
export default withRouter(connect(mapStateToProps)(Busme))